<template>

    <el-main>
        <el-col>
            <div style="float:left" class="head">
                <el-form :inline="true" class="demo-form-inline">

                    <el-input placeholder="请输入名称" v-model="select" style="width:150px"></el-input>
                    <el-button type="primary" style="margin-right:30px;" icon="el-icon-search"
                        @click="SelectName()">搜索</el-button>
                </el-form>
            </div>
        </el-col>
        <el-table :data="arr.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
            @selection-change="handleSelectionChange" style="width: 100% ;font-size:15px">
            <el-table-column type="selection" width="43px" :indeterminate="true" fixed="left">
            </el-table-column>
            <el-table-column prop="id" label="id">
            </el-table-column>
            <el-table-column prop="price" label="价格">
            </el-table-column>
            <el-table-column prop="storeName" label="店名">
            </el-table-column>
            <el-table-column prop="goodsType" label="产品类型">
            </el-table-column>
            <el-table-column label="配图" align="center">
                <template slot-scope="scope">
                    <el-image style="width: 140px; height: 60px" :src="scope.row.picture" fit="fill"></el-image>
                </template>
            </el-table-column>

            <el-table-column prop="goodsType" label="产品类型">
                <el-button size="mini" type="primary" @click.native.stop="">查看详情</el-button>
            </el-table-column>

        </el-table>
        <div class="block">
            <el-pagination :current-page.sync="currentPage" @current-change="handleCurrentChange" :page-size="pageSize"
                layout="prev, pager, next, jumper" :total="total">
            </el-pagination>
        </div>
    </el-main>


</template>

<script>
import { getList, modifyStatus, deleteUserSubmit } from '@/api/user/goods'
import axios from 'axios';
export default {
    data() {
        return {
            pageSize: 10,
            currentPage: 0,
            total: 0,


            select: '',
            pagerCount: 0,
            tableData: [],
            arr: []
        }
    },
    methods: {
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        a() {
            getList().then(res => {
                console.log(res)
                this.tableData = res.data
                this.arr = this.tableData
                const size = this.arr.length
                this.total = size
                this.pagerCount = size / this.pageSize
            })
        },
        handleCurrentChange(val) {
            this.currentPage = val;
        },
    },
    mounted() {
        this.a()
    }
}


</script>
<style lang="less" scoped>
.el-container {
    margin-left: 100px;
}

.el-dropdown {
    margin-left: 300px;

}

.el-main {
    margin-left: 50px;
}

.block {
    margin-left: 360px;
}
</style>
